/*
 * @Author: huangwei
 * @Date: 2021-06-15 16:27:21
 * @LastEditors: 黄威
 * @LastEditTime: 2021-09-08 16:24:11
 * @Description: 一个通用的tip操作类
 */

import settings from '@/settings'

export default function tip(container: HTMLElement, className?: string) {
    // pc端提示
    if (!settings.isMobile) {
        const tipDom = document.createElement('div')
        tipDom.className = 'mgs-tip-wrapper'
        if (className) tipDom.classList.add(className)
        tipDom.style.cssText = `position: fixed; left: 0; top: 0; width: max-content; z-index: 9999;`

        let isOpen = false

        const mouseleave = function () {
            tipDom.style.display = 'none'
            tipDom.style.willChange = 'auto'
        }
        const mousemove = function (ev: MouseEvent) {
            tipDom.style.display = 'block'
            tipDom.style.willChange = 'left, top'

            tipDom.style.left = ev.clientX + 'px'
            tipDom.style.top = ev.clientY + 'px'
        }

        return {
            showTip(message: string) {
                tipDom.innerText = message

                if (!isOpen) {
                    container.append(tipDom)

                    container.addEventListener('mousemove', mousemove)
                    container.addEventListener('mouseleave', mouseleave)

                    isOpen = true
                }

                mouseleave()
            },
            hideTip() {
                tipDom.remove()

                container.removeEventListener('mousemove', mousemove)
                container.removeEventListener('mouseleave', mouseleave)

                isOpen = false
            },
        }
    }
    // todo：移动端 提示
    else {
        return {
            showTip(message: string) {},
            hideTip() {},
        }
    }
}
